<template>
    <div class="myContainer">
        <el-row class="myPaddingTop_10px">
            <el-col :span="24">
                <el-tabs type="card" v-model="activeName" @tab-click="handleClick">
                    <el-tab-pane label="不合格" name="first">
                        <el-row :gutter="10">
                            <!-- <el-col :span="4">
                              <template>
                                <el-cascader
                                  placeholder="全部项目/小区"
                                  :options="regionOptions"
                                  v-model="regionOptSelected">
                                </el-cascader>
                              </template>
                            </el-col> -->
                            <el-col :span="3">
                                <template>
                                    <el-select
                                        v-model="hierarchyValue"
                                        @change="changeLevel"
                                        placeholder="层级">
                                        <el-option
                                            v-for="item in hierarchyList"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-col>
                            <el-col :span="3">
                                <template>
                                    <el-select
                                        v-model="regionValue"
                                        multiple
                                        collapse-tags
                                        class="mySelect"
                                        placeholder="区域">
                                        <el-option
                                            v-for="item in regionList"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-col>
                            <el-col :span="3">
                                <template>
                                    <el-select v-model="typeSelected"
                                               clearable
                                               placeholder="全部考核类型">
                                        <el-option
                                            v-for="item in typeOption"
                                            :key="item.type_id"
                                            :label="item.type_name"
                                            :value="item.type_id">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-col>
                            <el-col :span="3">
                                <template>
                                    <el-select v-model="subtypeSelected"
                                               clearable
                                               placeholder="全部考核项目">
                                        <el-option
                                            v-for="item in subtypeOption"
                                            :key="item.subtype_id"
                                            :label="item.subtype_name"
                                            :value="item.subtype_id">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-col>
                            <el-col :span="3">
                                <template>
                                    <el-select v-model="resultSelected"
                                               clearable
                                               :multiple="true"
                                               class="mySelect"
                                               placeholder="全部不合格标签">
                                        <el-option
                                            v-for="item in result"
                                            :key="item.label"
                                            :label="item.label"
                                            :value="item.label">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-col>
                            <el-col :span="3">
                                <el-input placeholder="请输入关键词" v-model="kw"></el-input>
                            </el-col>
                            <el-col :span="3">
                                <el-button type="primary" @click="search">查询</el-button>
                            </el-col>
                        </el-row>
                        <el-button type="primary" class="myBgGreen rtbtn" @click="sub" v-if="subState==0">提交</el-button>
                        <a id="downlink"></a>
                        <el-button type="primary" class="myBgGreen rtbtn" @click="onExport" ref="exportBtn"
                                   :loading="exportLoading" v-if="subState==1">导出
                        </el-button>
                        <el-row class="myPaddingTop_10px">
                            <el-col :span="24">
                                <template>
                                    <el-table
                                        border
                                        :data="list"
                                        :stripe=true
                                        v-loading="loading"
                                        style="width: 100%">
                                        <el-table-column
                                            label="序号"
                                            type="index"
                                            width="55">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核小区"
                                            prop="area_name">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核类别"
                                            prop="type_name">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核项目"
                                            prop="subtype_name">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核标准"
                                            prop="st_no">
                                        </el-table-column>
                                        <el-table-column
                                            label="处理人"
                                            prop="dealer_name">
                                        </el-table-column>
                                        <el-table-column
                                            label="处理时间"
                                            prop="commit_time">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核地址"
                                            prop="detail_address">
                                        </el-table-column>
                                        <el-table-column
                                            label="文字说明"
                                            prop="detail_info">
                                        </el-table-column>
                                        <el-table-column
                                            label="图片信息"
                                            prop="detail_img">
                                            <template scope="scope">
                                                <a :href="QINIU_API+i" v-for="i in scope.row.detail_img.split(',')"
                                                   target="_blank">
                                                    <img :src="QINIU_API+i" alt="" width="50"/>
                                                </a>
                                            </template>
                                        </el-table-column>
                                        <el-table-column
                                            label="不合格标签"
                                            prop="st_tag">
                                        </el-table-column>
                                        <el-table-column
                                            label="扣分值"
                                            prop="score">
                                        </el-table-column>
                                        <el-table-column
                                            label="整改天数"
                                            prop="rectify_days">
                                        </el-table-column>
                                        <el-table-column
                                            label="功能操作"
                                            width="120">
                                            <template scope="scope">
                        <span v-if="subState==0">
                          <el-button class="look" type="text" size="small"
                                     @click="onshowdialog(scope.row.detail_id,'update')">编辑</el-button> |
                        </span>
                                                <span v-if="subState==1">
                          <el-button class="look" type="text" size="small"
                                     @click="onshowdialog(scope.row.detail_id,'info')">详细</el-button>
                        </span>
                                                <span v-if="subState==0"> |
                          <el-button class="look" type="text" size="small"
                                     @click="ondelete(scope.row.detail_id)">删除</el-button>
                        </span>
                                            </template>
                                        </el-table-column>
                                    </el-table>
                                </template>
                            </el-col>
                        </el-row>
                        <el-row class="myPaddingTop_10px">
                            <el-col :span="6">
                                <el-button @click="onBack">关 闭</el-button>
                            </el-col>
                        </el-row>
                    </el-tab-pane>

                    <el-tab-pane label="合格" name="second">
                        <el-row :gutter="10">
                            <!-- <el-col :span="4">
                              <template>
                                <el-cascader
                                  placeholder="全部项目/小区"
                                  :options="regionOptions"
                                  v-model="regionOptSelected">
                                </el-cascader>
                              </template>
                            </el-col> -->
                            <el-col :span="3">
                                <template>
                                    <el-select
                                        v-model="hierarchyValue"
                                        @change="changeLevel"
                                        placeholder="层级">
                                        <el-option
                                            v-for="item in hierarchyList"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-col>
                            <el-col :span="3">
                                <template>
                                    <el-select
                                        v-model="regionValue"
                                        multiple
                                        collapse-tags
                                        class="mySelect"
                                        placeholder="区域">
                                        <el-option
                                            v-for="item in regionList"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-col>
                            <el-col :span="3">
                                <template>
                                    <el-select v-model="typeSelected"
                                               clearable
                                               placeholder="全部考核类型">
                                        <el-option
                                            v-for="item in typeOption"
                                            :key="item.type_id"
                                            :label="item.type_name"
                                            :value="item.type_id">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-col>
                            <el-col :span="3">
                                <template>
                                    <el-select v-model="subtypeSelected"
                                               clearable
                                               placeholder="全部考核项目">
                                        <el-option
                                            v-for="item in subtypeOption"
                                            :key="item.subtype_id"
                                            :label="item.subtype_name"
                                            :value="item.subtype_id">
                                        </el-option>
                                    </el-select>
                                </template>
                            </el-col>
                            <el-col :span="3">
                                <el-input placeholder="请输入关键词" v-model="kw"></el-input>
                            </el-col>
                            <el-col :span="3">
                                <el-button type="primary" @click="search">查询</el-button>
                            </el-col>
                        </el-row>
                        <el-button type="primary" class="myBgGreen rtbtn" @click="sub" v-if="subState==0">提交</el-button>
                        <a id="downlink"></a>
                        <el-button type="primary" class="myBgGreen rtbtn" @click="onExport" ref="exportBtn"
                                   :loading="exportLoading" v-if="subState==1">导出</el-button>
                        <el-row class="myPaddingTop_10px">
                            <el-col :span="24">
                                <template>
                                    <el-table
                                        border
                                        :data="list"
                                        :stripe=true
                                        v-loading="loading"
                                        style="width: 100%">
                                        <el-table-column
                                            label="序号"
                                            type="index"
                                            width="55">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核小区"
                                            prop="area_name">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核类型"
                                            prop="type_name">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核项目"
                                            prop="subtype_name">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核标准"
                                            prop="st_no">
                                        </el-table-column>
                                        <el-table-column
                                            label="处理人"
                                            prop="dealer_name">
                                        </el-table-column>
                                        <el-table-column
                                            label="处理时间"
                                            prop="commit_time">
                                        </el-table-column>
                                        <el-table-column
                                            label="考核地址"
                                            prop="detail_address">
                                        </el-table-column>
                                        <el-table-column
                                            label="文字说明"
                                            prop="detail_info">
                                        </el-table-column>
                                        <el-table-column
                                            label="图片信息"
                                            prop="detail_img">
                                            <template scope="scope">
                                                <a :href="QINIU_API+i" v-for="i in scope.row.detail_img.split(',')"
                                                   target="_blank">
                                                    <img :src="QINIU_API+i" alt="" width="50"/>
                                                </a>
                                            </template>
                                        </el-table-column>
                                        <el-table-column
                                            label="加分值"
                                            prop="score">
                                        </el-table-column>
                                        <el-table-column
                                            label="功能操作"
                                            width="120">
                                            <template scope="scope">
                        <span v-if="subState==0">
                          <el-button class="look" type="text" size="small"
                                     @click="onshowdialog(scope.row.detail_id,'update')">编辑</el-button> |
                        </span>
                                                <span v-if="subState==1">
                          <el-button class="look" type="text" size="small"
                                     @click="onshowdialog(scope.row.detail_id,'info')">详细</el-button>
                        </span>
                                                <span v-if="subState==0"> |
                          <el-button class="look" type="text" size="small"
                                     @click="ondelete(scope.row.detail_id)">删除</el-button>
                        </span>
                                            </template>
                                        </el-table-column>
                                    </el-table>
                                </template>
                            </el-col>
                        </el-row>
                        <el-row class="myPaddingTop_10px">
                            <el-col :span="6">
                                <el-button @click="onBack">关 闭</el-button>
                            </el-col>
                        </el-row>
                    </el-tab-pane>
                </el-tabs>
            </el-col>
        </el-row>
        <el-dialog title="详情" width='60%' :visible.sync="typeDialog">
            <el-row>
                <el-col :span="6" class="myLeftMsg">
                    考核结论:
                </el-col>
                <el-col :span="6" class="myLeftMsg">
                    <el-input placeholder="合格" v-if="detail.detail_result==0" :disabled="true">
                    </el-input>
                    <el-input placeholder="不合格" v-else :disabled="true">
                    </el-input>
                </el-col>
            </el-row>
            <el-row class="myPaddingTop_10px">
                <el-col :span="6" class="myLeftMsg">
                    扣分值:
                </el-col>
                <el-col :span="18">
                    <template>
                        <el-select v-model="detail.score"
                                   clearable
                                   :disabled="readonly"
                                   placeholder="扣分值">
                            <el-option :key="0" :label="0" :value="0"></el-option>
                            <el-option
                                v-for="i in 20"
                                :key="i/2"
                                :label="i/2"
                                :value="i/2">
                            </el-option>
                        </el-select>
                    </template>
                </el-col>
            </el-row>
            <el-row class="myPaddingTop_10px" v-if="activeName=='first'">
                <el-col :span="6" class="myLeftMsg">
                    整改天数:
                </el-col>
                <el-col :span="18">
                    <el-input placeholder="整改天数" v-model="detail.rectify_days" :readonly="readonly"></el-input>
                </el-col>
            </el-row>
            <el-row class="myPaddingTop_10px">
                <el-col :span="6" class="myLeftMsg">
                    不合格标签:
                </el-col>
                <el-col :span="18" style="line-height: 40px">
                    <!--<el-checkbox-group v-model="st_tag" size="mini" :disabled="readonly">-->
                    <!--<el-checkbox-button v-for="label in labelOption" :label="label" :key="label">{{label}}</el-checkbox-button>-->
                    <!--</el-checkbox-group>-->
                    <el-tag v-for="tag in st_tag" v-if="tag.length > 0"
                            :key="tag"
                            :type="danger">{{tag}}
                    </el-tag>
                </el-col>
            </el-row>
            <el-row class="myPaddingTop_10px">
                <el-col :span="6" class="myLeftMsg">
                    现场图片:
                </el-col>
                <el-col :span="18">
                    <el-upload
                        :action="uploadUrl"
                        list-type="picture-card"
                        :on-preview="handlePictureCardPreview"
                        :before-upload="beforeAvatarUpload"
                        :on-exceed="handleExceed"
                        :data="postData"
                        :limit="3"
                        :disabled="readonly"
                        :file-list="fileList"
                        :on-success="handleAvatarSuccess"
                        :on-remove="handleRemove">
                        <i class="el-icon-plus"></i>
                    </el-upload>
                    <el-dialog :visible.sync="dialogVisible">
                        <img width="100%" :src="dialogImageUrl" alt="">
                    </el-dialog>
                    <!-- <img :src="i" alt="" v-for="i in detail.detail_img.split(',')" width="50"/> -->
                </el-col>
            </el-row>
            <el-row class="myPaddingTop_10px">
                <el-col :span="6" class="myLeftMsg">
                    文字说明:
                </el-col>
                <el-col :span="18">
                    <el-input placeholder="考核结论" type="textarea" v-model="detail.detail_info"
                              :readonly="readonly">
                    </el-input>
                </el-col>
            </el-row>
            <el-row class="myPaddingTop_10px">
                <el-col :span="6" class="myLeftMsg">
                    考核地址:
                </el-col>
                <el-col :span="18">
                    <el-input placeholder="考核地址" type="textarea" v-model="detail.detail_address"
                              :readonly="readonly"></el-input>
                </el-col>
            </el-row>
            <div slot="footer" class="dialog-footer">
                <el-button class="myBgGreen" @click="onupdateDetail" v-if="subState==0">保 存</el-button>
                <el-button @click="typeDialog = false">取 消</el-button>
            </div>
        </el-dialog>

    </div>
</template>

<style>
    .mySelect .el-input__inner, .mySelect .el-select__tags {
        height: 40px !important;
        overflow: hidden;
    }

    .mySelect.el-select .el-tag {
        margin: 8px 0 3px 6px !important;
    }

    .el-tag + .el-tag {
        margin-left: 10px;
    }

    .el-tabs__content {
        overflow: visible;
    }
</style>

<style scoped>
    .myContainer {
        background: #fff;
        padding: 10px;
    }

    .myLeftMsg {
        line-height: 40px;
        text-align: right;
        padding-right: 10px;
    }

    .myPaddingBottom_10px {
        padding-bottom: 10px;
    }

    .myVA_M {
        vertical-align: middle;
    }

    .myBgGreen {
        background: #00c2a9;
        border-color: #00c2a9;
        color: #fff;
        margin-top: 2px;
    }

    .myBgGreen:hover {
        background: #33ceba;
    }

    .myLineHeight_45px {
        line-height: 45px;
    }

    .mymarginTop_10px {
        margin-top: 10px;
    }

    .myDialogSearchText {
        width: 360px;
    }

    .myPaddingTop_10px {
        padding-top: 10px;
    }

    .myLineHeight_40px {
        line-height: 40px;
    }

    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }

    .avatar-uploader .el-upload:hover {
        border-color: #409EFF;
    }

    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }

    .avatar {
        width: 178px;
        height: 178px;
        display: block;
    }

    .isdisplay {
        display: node !important;
    }

    .rtbtn {
        position: absolute;
        top: -60px;
        right: 0;
    }
</style>

<script>

    import {extractAreaIds, onSetArea} from '@/utils/misc';
    import {getRegion} from '@/utils/localstorage';
    import {
        infoMainTask,
        getDetailTaskList,
        getRectifyDetailTaskList,
        getDetailPlanList,
        infoDetailMainTask,
        updateDetail,
        getTypeList,
        getSubtypeList,
        deleteDetail,
        subCommit,
        excelKey
    } from '@/api/quality';
    import {getQNToken} from '@/api/contentMGT';
    import {QINIU_API, QINIU_UP_API} from '@/config/baseUrl';
    import {getLevelArea} from "@/api/area";

    let XLSX = require('xlsx');
    export default {
        data() {
            return {
                title: "检查结果",
                tableData: [],
                list: [],
                page_num: 1,
                page_size: 10,
                total: null,
                loading: false,
                readonly: true,
                standardSelected: "",
                standard: [
                    {label: "已执行", value: "1"},
                    {label: "未执行", value: "0"}
                ],
                resultSelected: "",
                result: [
                    {label: "管理工具运用", value: "1"},
                    {label: "制度严格执行", value: "2"},
                    {label: "流程标准规范", value: "3"},
                    {label: "工作效率", value: "4"},
                    {label: "培训反馈", value: "5"}
                ],
                labelOption: ['管理工具运用', '制度严格执行', '流程标准规范', '工作效率', '培训反馈'],
                kw: "",
                id: "",
                type: "",
                flag: "",
                activeName: "first",
                taskDig: false,
                datas: {},
                mainstatus: "",
                rectifylist: [],
                typeDialog: false,

                regionOptions: [],
                regionOptSelected: [],

                resultkey: 1,
                detail: [],
                typeSelected: '',
                typeOption: [],
                subtypeSelected: '',
                subtypeOption: [],
                st_tag: [],
                dialogImageUrl: '',
                dialogVisible: false,
                postData: {
                    token: ""
                },
                uploadUrl: QINIU_UP_API,
                QINIU_API: QINIU_API,
                thumbnailUrl: [],
                fileList: [],
                isdisplay: false,
                detail_id: '',
                subState: '-',
                exportLoading: false,

                hierarchyValue: 1,
                hierarchyList: [
                    {value: 1, label: "集团"},
                    {value: 2, label: "片区"},
                    {value: 3, label: "小区"},
                ],
                regionValue: [],
                regionList: [],
            }
        },
        components: {},
        watch: {
            typeSelected(val) {
                this.ongetSubtypeList(val);
            }
        },
        computed: {
            areaIds() {
                return extractAreaIds(this.regionOptSelected, this.regionOptions);
            }
        },
        filters: {
            status(val) {
                let type = {
                    "1": "待整改",
                    "2": "待审核",
                    "3": "已完成",
                }
                return type[val];
            },
            detailResult(val){
                let type = {
                    "1": "不合格",
                    "0": "合格",
                }
                return type[val];
            }
        },
        created() {
            this.regionOptions = getRegion();
            this.regionOptSelected.push(this.regionOptions[0].value, this.regionOptions[0].children[0].value, this.regionOptions[0].children[0].children[0].value);

            this.id = this.$route.query.id;
            this.type = this.$route.query.type;
            this.flag = this.$route.query.flag;
            this.activeName = this.flag || "first";
            if (this.activeName == "second") {
                this.resultkey = 0;
                this.ongetDetailPlanList();
            }
            this.changeLevel(1);//区域
            this.ongetDetailPlanList();

            this.ongetTypeList();

            this.onGetToken();

        },
        mounted() {
            document.title = this.title;
            this.outFile = document.getElementById('downlink');
        },
        methods: {
            handleSizeChange(val) {//每页条数控制
                this.page_size = val;
                this.ongetDetailPlanList();
            },
            handleCurrentChange(val) {//每页
                this.page_num = val;
                this.ongetDetailPlanList();
            },
            search() {
                this.ongetDetailPlanList();
            },
            onBack() {
                this.$router.go(-1);
            },
            toDetailed(id) {
                this.$router.push({
                    path: "supervisoryTaskDtailed",
                    query: {
                        type: "info",
                        taskid: this.id,
                        id: id
                    }
                })
            },
            openDetailed(id) {
                let vm = this;
                vm.ongetRectifyDetailTaskList(id);
            },
            toReDetailed(id) {
                this.$router.push({
                    path: "supervisorySubtaskComonents",
                    query: {
                        flag: "back",
                        id: id,
                        taskid: this.id,
                        type: "info"
                    }
                })
            },
            oninfoMainTask() {
                let vm = this;
                infoMainTask(vm.id).then(response => {
                    let res = response.data;
                    vm.datas = res;
                    vm.mainstatus = vm.mainTask(res.status);
                }).catch(error => {
                    vm.$message.error("执行失败！" + error.response.data.error_msg);
                })
            },
            mainTask(val) {
                let type = {
                    "1": "待处理",
                    "2": "处理中",
                    "3": "整改中",
                    "4": "已完成",
                    "5": "逾期",
                }
                return type[val];
            },
            ongetDetailTaskList() {
                let vm = this;
                let params = {
                    type_id: vm.majorSelected,
                    status: vm.standardSelected,
                    keyword: vm.kw,
                    result: vm.resultSelected,
                    page_num: vm.page_num,
                    page_size: vm.page_size
                }
                vm.loading = true;
                getDetailTaskList(params, vm.id).then(response => {
                    let res = response.data;
                    vm.list = res.rows;
                    vm.page_size = res.page_size;
                    vm.page_num = res.page_num;
                    vm.total = res.total;
                    vm.loading = false;
                }).catch(error => {
                    vm.loading = false;
                    vm.$message.error("执行失败！" + error.response.data.error_msg);
                })
            },
            handleClick(tab, event) {
                let vm = this;
                if (tab.name == "second") {
                    vm.resultkey = 0;
                } else {
                    vm.resultkey = 1;
                }
                vm.ongetDetailPlanList();
            },
            ongetRectifyDetailTaskList(id) {
                let vm = this;
                getRectifyDetailTaskList(id).then(response => {
                    let res = response.data;
                    vm.rectifylist = res;
                    vm.taskDig = true;
                }).catch(error => {
                    vm.$message.error("执行失败！" + error.response.data.error_msg);
                })
            },
            detailinfo(id) {
                this.typeDialog = true;
            },
            ongetDetailPlanList() {
                let vm = this;
                let params = {
                    level: vm.hierarchyValue,
                    result: vm.resultkey,//0：不合格 1：合格
                    district: vm.regionValue.join(','),//vm.areaIds,
                    type_id: vm.typeSelected,
                    subtype_id: vm.subtypeSelected,
                    keyword: vm.kw,
                    st_tag: vm.resultSelected ? vm.resultSelected.join(',') : ''
                };

                console.log(params);
                getDetailPlanList(vm.id, params).then(response => {
                    let res = response.data;
                    vm.list = res;
                    if (res) {
                        //0未提交 1已提交
                        vm.subState = Number(res[0].is_commited);
                    }
                    console.log('---', vm.subState)
                }).catch(error => {
                })
            },
            onshowdialog(id, type) {
                this.detail_id = id;
                type == 'update' ? this.readonly = false : this.readonly = true;
                this.oninfoDetailMainTask(id);
            },
            oninfoDetailMainTask(id) {
                let vm = this;
                infoDetailMainTask(id).then(response => {
                    let res = response.data;
                    vm.detail = res;
                    if (res.st_tag) {
                        vm.st_tag = res.st_tag.split(',');
                    } else {
                        vm.st_tag = [];
                    }
                    vm.fileList = [];
                    vm.thumbnailUrl = [];
                    if (res.detail_img) {
                        let imgs = res.detail_img.split(',');
                        for (let i = 0; i < imgs.length; i++) {
                            vm.fileList.push({
                                url: QINIU_API + imgs[i]
                            })
                            vm.thumbnailUrl.push(imgs[i])
                        }
                    }
                    vm.typeDialog = true;
                }).catch(error => {
                })
            },
            onupdateDetail() {
                let vm = this;
                // vm.detail.rectify_days
                vm.detail.detail_img = vm.thumbnailUrl.join(',');
                vm.detail.st_tag = vm.st_tag.join(',');
                updateDetail(vm.detail_id, vm.detail).then(response => {
                    let res = response.data;
                    vm.$message.success("执行成功！");
                    vm.ongetDetailPlanList();
                    vm.typeDialog = false;
                }).catch(error => {
                    vm.$message.success("执行失败！" + error.response.data.error_msg);
                })
            },
            ondelete(id) {
                let vm = this;
                vm.$confirm('是否确定删除本条考核记录，记录删除后无法恢复！', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    deleteDetail(id).then(response => {
                        vm.$message.success("执行成功！");
                        vm.ongetDetailPlanList();
                    }).catch(error => {
                        vm.$message.error("执行失败！" + error.response.data.error_msg);
                    })
                }).catch(() => {
                    vm.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            ongetTypeList() {
                let vm = this;
                let params = {
                    page_num: 1,
                    page_size: 999
                }
                getTypeList(params).then(response => {
                    let res = response.data;
                    vm.typeOption = res.rows;
                }).catch(error => {
                    vm.$message.error("执行失败！" + error.response.data.error_msg);
                })
            },
            ongetSubtypeList(val) {
                let vm = this;
                let params = {
                    type_id: val,
                    page_num: 1,
                    page_size: 999
                }
                getSubtypeList(params).then(response => {
                    let res = response.data;
                    vm.subtypeOption = res.rows;
                }).catch(error => {
                    vm.$message.error("执行失败！" + error.response.data.error_msg);
                })
            },
            handlePictureCardPreview(file) {
                this.dialogImageUrl = file.url;
                this.dialogVisible = true;
            },
            beforeAvatarUpload(file) {
                const isJPG = file.type === 'image/jpeg';
                const isPNG = file.type === 'image/png';
                const isLt2M = file.size / 1024 / 1024 < 2;
                if (!isJPG && !isPNG) {
                    this.$message.error('上传图片只能是 JPG/PNG 格式!');
                }
                if (!isLt2M) {
                    this.$message.error('上传图片大小不能超过 2MB!');
                }
                return (isJPG || isPNG) && isLt2M;
            },
            onGetToken() {//拉取七牛token
                let vm = this;
                getQNToken().then(response => {
                    let res = response.data.up_token;
                    vm.postData.token = res;
                }).catch(error => {
                })
            },
            handleExceed(file, fileList) {
                this.$message.info("最多3张!");
            },
            handleAvatarSuccess(res, file, filelist) {
                this.thumbnailUrl = [];
                // filelist.length>3?this.isdisplay=true:this.isdisplay=false;
                for (let i = 0; i < filelist.length; i++) {
                    if (filelist[i].response) {
                        this.thumbnailUrl.push(filelist[i].response.key)
                    } else {
                        this.thumbnailUrl.push(filelist[i].url)
                    }
                }
            },
            handleRemove(file, filelist) {
                this.thumbnailUrl = [];
                for (let i = 0; i < filelist.length; i++) {
                    if (filelist[i].response) {
                        this.thumbnailUrl.push(filelist[i].response.key)
                    } else {
                        this.thumbnailUrl.push(filelist[i].url)
                    }
                }
            },
            sub() {
                let vm = this;
                vm.subState = "-";
                vm.$confirm('确定提交此任务吗！', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    subCommit(vm.id).then(response => {
                        vm.$message.success("执行成功！");
                        vm.subState = 1;
                    }).catch(error => {
                        vm.$message.error("执行失败！" + error.response.data.error_msg);
                        vm.subState = 0;
                    })
                }).catch(() => {
                    vm.$message({
                        type: 'info',
                        message: '已取消提交'
                    });
                    vm.subState = 0;
                });
            },
            onExport() {
                let vm = this;
                let name = `检查结果`;
                let data = [{}]
                vm.exportLoading = true;
                let subRes = [];
                let subObj = {};
                for (let i in vm.list) {
                    subObj = {};
                    for (let j in vm.list[i]) {
                        subObj[j] = vm.list[i][j];
                    }
                    subRes.push(subObj);
                }
                for (let k in subRes[0]) {
                    data[0][k] = k
                }
                data = data.concat(subRes);
                vm.downloadExl(data, name);
                vm.exportLoading = false;
                vm.$message.success(`导出成功！总共${vm.list.length}条数据。`);
            },
            downloadExl: function (json, downName, type) {  // 导出到excel
                let keyMap = []// 获取键
                for (let k in json[0]) {
                    keyMap.push(k);
                }
                let tmpdata = [] // 用来保存转换好的json
                json.map((v, i) => keyMap.map((k, j) => Object.assign({}, {
                    v: v[k],
                    position: (j > 25 ? this.getCharCol(j) : String.fromCharCode(65 + j)) + (i + 1)
                }))).reduce((prev, next) => prev.concat(next)).forEach(function (v) {
                    tmpdata[v.position] = {
                        v: excelKey[v.v] || v.v
                    }
                })
                let outputPos = Object.keys(tmpdata)  // 设置区域,比如表格从A1到D10
                let tmpWB = {
                    SheetNames: ['检查结果'], // 保存的表标题
                    Sheets: {
                        '检查结果': Object.assign({},
                            tmpdata, // 内容
                            {
                                '!ref': outputPos[0] + ':' + outputPos[outputPos.length - 1] // 设置填充区域
                            })
                    }
                }
                let tmpDown = new Blob([this.s2ab(XLSX.write(tmpWB,
                    {bookType: (type === undefined ? 'xlsx' : type), bookSST: false, type: 'binary'} // 这里的数据是用来定义导出的格式类型
                ))], {
                    type: ''
                })  // 创建二进制对象写入转换好的字节流
                var href = URL.createObjectURL(tmpDown)  // 创建对象超链接

                // console.log('---',downName,href)
                this.outFile.download = downName + '.xlsx'  // 下载名称
                this.outFile.href = href  // 绑定a标签
                this.outFile.click()  // 模拟点击实现下载

                setTimeout(function () {  // 延时释放
                    URL.revokeObjectURL(tmpDown) // 用URL.revokeObjectURL()来释放这个object URL
                }, 100)
            },
            s2ab: function (s) { // 字符串转字符流
                var buf = new ArrayBuffer(s.length)
                var view = new Uint8Array(buf)
                for (var i = 0; i !== s.length; ++i) {
                    view[i] = s.charCodeAt(i) & 0xFF
                }
                return buf
            },
            getCharCol: function (n) { // 将指定的自然数转换为26进制表示。映射关系：[0-25] -> [A-Z]。
                let s = ''
                let m = 0
                while (n > 0) {
                    m = n % 26 + 1
                    s = String.fromCharCode(m + 64) + s
                    n = (n - m) / 26
                }
                return s
            },
            changeLevel(val) {
                let vm = this;
                let params = {
                    level: val
                }
                getLevelArea(params).then(response => {
                    let res = response.data;
                    vm.regionList = res;
                    if (res.length > 0) {
                        //vm.regionValue=[res[0].value];
                        vm.regionValue = [];
                        vm.regionValue.push(res[0].value);
                    }
                }).catch(error => {
                    vm.$message.error("执行失败！" + error.response.data.error_msg);
                })
            },
        }

    }


</script>



